import React, { Component } from 'react'
import { Button, Modal, Select, Form, Row, Col, Input, Radio, DatePicker, message } from 'antd';
import { connect } from 'dva';
import BaseComponent from '@/components/BaseComponent';
import moment from 'moment';


@connect(({ user }) => ({
    // data: risk.riskData,
    currentUser: user.currentUser,
}))
export default class index extends BaseComponent {
    constructor(props) {
        super(props)
        this.state = {
            visible: false,
            form: {
            },
        }
    }

    nameChange = (e) => {
        const value = e.target.value;
        this.setState((params) => ({
            form: {
                ...params.form,
                name: value
            }
        }));
    }
    codeChange = (e) => {
        const value = e.target.value;
        this.setState((params) => ({
            form: {
                ...params.form,
                code: value
            }
        }));
    }

    showModal = () => {
        this.selById()
        this.setState({
            visible: true,
        });
    };

    handleOk = () => {
        this.edit(this.state.form)
        this.setState({
            visible: false,
        });

    };

    handleCancel = () => {
        this.setState({
            visible: false,
            form: {}
        });
    };

    //详情
    selById = () => {
        this.setState((params) => ({
            form: {
                ...params.form,
                name: this.props.record.name,
                code: this.props.record.code,
            }
        }));

    };



    //编辑保存
    edit = (form) => {
        const id = this.props.record.id
        this.execHttp('administrativeOfficesManagement/edit', {
            id, ...form,
        }).then(resp => {
            if (resp && resp.success) {
                message.success(resp.message);
                this.props.getDataByPage({})
            }
        });
    };

    render() {
        const { visible } = this.state;
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 8 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 16 },
            },
        };


        return (
            <div>
                <Button type="primary" onClick={this.showModal} >修改</Button>
                <Modal
                    title="修改"
                    visible={visible}
                    onOk={this.handleOk}
                    onCancel={this.handleCancel}
                    width={1200}
                >
                    <Form {...formItemLayout} >
                        <Row gutter={16} >
                            <Col span={8}>
                                <Form.Item label="科室名称">
                                    <Input placeholder="科室名称" value={this.state.form.name}
                                        onChange={this.nameChange} style={{ width: 200 }} />
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="科室代码">
                                    <Input placeholder="科室代码" value={this.state.form.code}
                                        onChange={this.codeChange} style={{ width: 200 }} />
                                </Form.Item>
                            </Col>

                        </Row>

                    </Form>
                </Modal>


            </div>
        )
    }
}
